<template>
  <div class="main">
    <div style="margin: 20px;">
      <el-form :model="form" ref="vForm" label-position="left" label-width="80px" size="medium"
               @submit.native.prevent v-if="form.length">
        <el-form-item :label="form[0].name" label-width="150px" prop="settingVal">
          <el-slider v-model="form[0].settingVal" :step="1" show-input></el-slider>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submit">保存</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
export default {
  name: "Setting",
  data() {
    return {
      form: [],
      data: []
    }
  },
  mounted() {
    this.getData()
  },
  methods: {
    getData() {
      this.$http.get('setting/all').then(res => {
        if (res.code === 200) {
          this.form = res.data
          this.form[0].settingVal = parseInt(this.form[0].settingVal)
        }
      })
    },
    submit() {
      this.$http.put(`setting/all`, this.form).then(res => {
        if(res.code === 200) {
          this.$Message.success(res.msg)
          this.getData()
          this.dialogShow = false
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
